<script>
import request from "../../../utils/request"
import { showModal, showToast, valIsEmpty } from "@/utils"
import process from "../../components/practice/process.vue"
import doing from "../../components/practice/doing.vue"
import shareInfo from "../../../utils/shareInfo"
import rightArrowIcon from "../../../static/mine/right-arrow.png"
import persistence from "@/store/persistence"
import websocket from "@/utils/websocket"
import store from "@/store"
import { userActionType } from "@/store/modules/user"
import { appActionType } from "@/store/modules/app"
import studyRoomFloat from "@/components/studyRoomFloat/index.vue"
import studyReport from "./components/studyReport.vue"
import { getEnv } from "@/utils/settings"

let timer
export default {
  name: "index",
  components: { process, doing, studyRoomFloat, studyReport },
  computed: {
    currentWordItem: {
      get() {
        return this.wordList.length > 0 ? this.wordList[this.currentIndex] : null
      },
      set(val) {
        this.wordList[this.currentIndex] = val
      },
    },
  },
  data() {
    return {
      planInfo: {},
      examInfo: {},
      wordList: [],
      currentIndex: -1,
      rightArrowIcon,
			// 用于计算用时
			beginTimestamp: new Date().getTime(),
			endTimestamp: 0,
			backedPlanId: "", // 带背词库单元id
    }
  },
  methods: {
    //上一个单词
    async prevWord() {
      //防止数组越界
      if (this.currentIndex > 0) {
        this.currentIndex--
      } else {
        showToast.default("已经是第一个单词了")
      }
    },
    //将背单词的记录提交到后台
    async submitRecord(userAnswer = false) {
      this.wordList[this.currentIndex].userAnswer = userAnswer // 输出统计报告会用到
      //将单个记录提交到后台
      await request({
        url: "userWordsRecord/add",
        data: {
          wordId: this.wordList[this.currentIndex].wordId,
          userAnswer: valIsEmpty(userAnswer) ? false : userAnswer,
          planId: this.planInfo.planId,
          examId: this.examInfo.examId,
          thesaurusId: this.planInfo.thesaurusId,
					backedPlanId: this.backedPlanId,
        },
        showLoading: true,
      }).catch((err) => {
        console.log(err, "err")
      })
    },
    //下一个单词
    async nextWord(userAnswer) {
      await this.submitRecord(userAnswer)
      //如果当前单词已经是列表中的最后一个单词
      if (this.currentIndex >= this.wordList.length - 1) {
				this.endTimestamp = new Date().getTime()
        try {
					await this.$refs.studyReport.open(this.wordList, this.endTimestamp - this.beginTimestamp)
          uni.reLaunch({ url: "/vocabulary/pages/currentPlanInfo/index" })
          return
        } catch (e) {
          showToast.error(e)
          uni.hideLoading()
        }
        //转到下一个单词
      } else {
        this.currentIndex++
      }
    },
  },
  onShow() {
    websocket.trackCurrentPage("单词学习", "BRUSH_WORDS", 1).catch(() => {})
  },
  async onLoad(option) {
		this.backedPlanId = option.backedPlanId
    //获取计划信息
    this.examInfo = await store.dispatch(userActionType.action.examInfo)
    this.planInfo = await request({
      url: "userCheckPlan/getUserCurrentlyPlan",
      data: {
        examId: this.examInfo.examId,
      },
      showLoading: true,
      errorHandle: true,
    })
    //获取单词列表
    let data = await request({
      url: "thesaurus/startBackedPlan",
      data: {
        thesaurusId: this.planInfo.thesaurusId,
				planId: this.planInfo.planId,
				backedPlanId: this.backedPlanId,
      },
      showLoading: true,
      errorHandle: true,
    })
    this.wordList = data
    //回显之前的背单词进度
    const currentProcess = Number.parseInt(option.currentStudyNum)
    if (currentProcess >= 1 && currentProcess < this.wordList.length) {
      this.currentIndex = currentProcess
    } else {
      this.currentIndex = 0
    }
  },
  beforeDestroy() {
    //结束记录学习时长
    websocket.trackCurrentPage("单词学习", "BRUSH_WORDS", 2).catch(() => {})
  },
  //右上角分享
  async onShareAppMessage() {
    return await shareInfo.getDefaultShareInfo()
  },
}
</script>

<template>
  <view class="page">
    <process ref="process" :total-count="wordList.length" :current-index="currentIndex"></process>
    <!--		背单词区域-->
    <doing
      ref="doing"
      v-if="wordList.length > 0 && currentIndex >= 0"
      :thesaurus-id="planInfo.thesaurusId"
      :practice-mode="planInfo.practiceMode"
      :current-index="currentIndex"
      :word-list="wordList"
      @submitRecord="submitRecord"
      @nextWord="nextWord"
      @prev-word="prevWord"
      height="calc(100vh - 60rpx - env(safe-area-inset-bottom))"
    ></doing>
		
		<studyRoomFloat></studyRoomFloat>
		<studyReport ref="studyReport"></studyReport>
  </view>
</template>

<style scoped lang="scss">
.page {
  min-height: 100vh;
  position: relative;
}
</style>
